<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>七海后台管理系统</title>
    <link rel="stylesheet" href="/static/plugins/layui/css/layui.css">
</head>

<body>
    <div class="layui-layout layui-layout-admin">
        <!-- 引入公共页面 -->
        {{include "./common/header.html"}}
        <!-- 引入公共页面 -->
        {{include "./common/side-menu.html"}}

        <div class="layui-body">
            <!-- 内容主体区域 -->
            <div style="padding :15px">
                <span class="layui-breadcrumb" lay-separator=">">
                    <a href="/">首页</a>
                    <a href="/addCate">分类编辑</a>
                </span>
                <form class="layui-form" lay-filter="sortData">
                    <input type="hidden" name="cate_id">
                    <div class="layui-form-item">
                        <label class="layui-form-label">分类名称</label>
                        <div class="layui-input-inline">
                            <input type="text" name="cate_name" required lay-verify="required" placeholder="请输入标题"
                                autocomplete="off" class="layui-input">
                        </div>
                    </div>
                    <div class="layui-form-item">
                        <label class="layui-form-label">是否显示</label>
                        <div class="layui-input-block">
                            <input type="radio" name="is_show" value="0" title="不显示" checked>
                            <input type="radio" name="is_show" value="1" title="显示">
                        </div>
                    </div>
                    <div class="layui-form-item">
                        <div class="layui-input-block">
                            <button class="layui-btn" lay-submit lay-filter="formDemo">确认编辑</button>
                            <button type="reset" class="layui-btn layui-btn-primary">重置</button>
                        </div>
                    </div>
                </form>
            </div>
        </div>
        <!-- 引入公共页面 -->
        {{include "./common/footer.html"}}
</body>
<script src="/static//js//jquery.js"></script>
<script src="/static/plugins/layui/layui.js"></script>
<script src="https://cdn.jsdelivr.net/npm/wangeditor@latest/dist/wangEditor.min.js"></script>
<script>
    layui.use(['element', 'layer', 'util', 'form'], function () {
        var element = layui.element
            , layer = layui.layer
            , util = layui.util
            , $ = layui.$
            , form = layui.form
        // head
        util.event('lay-header-event', {
            //左侧菜单
            menuleft: function (othis) {
                layer.msg('展开左侧菜单的操作', { icon: 0 });
            }
            , menuRight: function () {
                layer.open({
                    type: 1
                    , content: "<div style='padding:15px';>处理右侧面板的操作</div>"
                    , area: ['260px', "100%"]
                    , offset: 'rt' //右上角
                    , anim: 5
                    , shadeClose: true
                });
            }
        })

        // 表单监听提交
        form.on('submit(formDemo)', function (data) {
            let {cate_id,cate_name,is_show} = data.field
            $.post('/updateCate',{cate_id,cate_name,is_show},function(res){
                let {code,message} = res;
                if(code == 20000){
                    layer.msg(message)
                    location.href = '/catelist'
                }else{
                    if(code == -1){
                        layer.msg(message)
                        return;
                    }
                }
            },'json')
            return false;
        });

        //给表单赋值(数据回显操作)
        form.val("sortData", { //formTest 即 class="layui-form" 所在元素属性 lay-filter="" 对应的值
            "cate_name":"{{detailData.cate_name}}",
            "is_show":"{{detailData.is_show}}",
            "cate_id":"{{detailData.cate_id}}"
        });
    })




    // //   初始化富文本编辑器
    // const E = window.wangEdite
    // const editor = new E('#demo')
    // // 或 const editor = new E(document.getElementById('div1'))
    // editor.create();


    // 获取url地址中的cat_id
    // let url = location.href;
    // let queryString = url.slice(url.indexOf('?')+1)
    // let cat_id = queryString.split('=')[1];


    // let reg = /cat_id=(\d+)\&?/;
    // let url = location.href;
    // let [, cat_id] = [...url.match(reg)]
    // console.log(cat_id);

    // var form;
    // layui.use(['element', 'layer', 'util', 'form'], function () {
    //     var element = layui.element
    //         , layer = layui.layer
    //         , util = layui.util
    //         , $ = layui.$;
    //     // head
    //     util.event('lay-header-event', {
    //         //左侧菜单
    //         menuleft: function (othis) {
    //             layer.msg('展开左侧菜单的操作', { icon: 0 });
    //         }
    //         , menuRight: function () {
    //             layer.open({
    //                 type: 1
    //                 , content: "<div style='padding:15px';>处理右侧面板的操作</div>"
    //                 , area: ['260px', "100%"]
    //                 , offset: 'rt' //右上角
    //                 , anim: 5
    //                 , shadeClose: true
    //             });
    //         }
    //     })
    //     // 表单提交事件
    //     form = layui.form;

    //     //   提交表单
    //     form.on('submit(formDemo)', function (data) {
    //         let mydata = {
    //             cat_id,
    //             content: editor.txt.html(),
    //             ...data.field
    //         }
    //         $.post('/updateCate', mydata, (res) => {
    //             let { message, code } = res;
    //             layer.msg(message)
    //             if (code === 20000) {
    //                 location.href = "/catelist"
    //             }
    //         }, 'json')
    //         return false;
    //     });

    // });
    // // 通过cat_id发送Ajax请求，获取分类的数据，回显到表单页面中
    // $.get('/getCateDetail', { cat_id }, function (res) {
    //     let { cate_name, is_show, content } = res;
    //     //  赋值
    //     form.val('formCate', {
    //         "cate_name": cate_name,
    //         "is_show": is_show == 1 ? true : false
    //     })
    //     editor.txt.html(content)
    // }, 'json')
</script>

</html>